<template>
	<view class="flex-col page">
		<view class="flex-col group">
			<view class="flex-row section_1" style="position: fixed; z-index: 9;">
				<text class="text" @click="switchIndex(0)">首页</text>
				<text class="text_1" @click="switchIndex(1)">我家总览</text>
			</view>
			<view class="flex-col group_1">
				<view class="flex-col section_2" style="box-shadow: 1rpx 0rpx 10rpx 0rpx #f0f0f0;">
					<view class="justify-between group_2" style="align-items: center;"
						@click="go('/pages/index/design/design')">
						<view class="flex-row" style="align-items: center; display: flex;">
							<image :src="imgUrl+'16557826792503103103.png'" class="image image_1" />
							<text class="text_2">我家施工图</text>
						</view>
						<view class="flex-row group_4">
							<image :src="imgUrl+'16557826794667902978.png'" class="image_2" />
							<text class="text_3">编辑</text>
						</view>
					</view>
					<view class="flex-col items-center " v-if="pics.length>0">
						<u-swiper style="width: 654rpx;" :list="pics" radius="15" height="328" @click="ViewImage($event, pics)"></u-swiper>
					</view>
					<view v-else>
						<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
						</u-empty>
					</view>
				</view>
				<view class="flex-col section_3">
					<view class="justify-between group_5" style="align-items: center;"
						@click="go('/pages/index/estimatelist/estimatelist')">
						<view class="flex-row" style="align-items: center; display: flex;">
							<image :src="imgUrl+'16557826792503103103.png'" class="image image_5" />
							<text class="text_4">装修估算</text>
						</view>
						<view class="flex-row group_7">
							<image :src="imgUrl+'16557826794667902978.png'" class="image_2" />
							<text class="text_5">编辑</text>
						</view>
					</view>

					<view v-if="pieshow">
						<view class="flex-row button">
							<text class="text_6">装修估算价：</text>
							<text class="text_7">{{totalPrice}}</text>
						</view>
						<view class="flex-col group_8">
							<qiun-data-charts type="pie" :localdata="pies" :onmouse="false" />
						</view>
					</view>
					<view v-else>
						<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
						</u-empty>
					</view>

				</view>
				<view class="flex-col section_5" @click="go('/pages/tool/book')">
					<view class="justify-between group_12" style="align-items: center;">
						<view class="flex-row" style="align-items: center; display: flex;">
							<image :src="imgUrl+'16557826792503103103.png'" class="image image_12" />
							<text class="text_11">合同总览</text>
						</view>
						<text class="text_12">查看详情</text>
					</view>
					<view class="flex-col group_14" v-if="hetong">
						<view class="divider">
							<!--*-->
						</view>
						<view class="flex-row equal-division">
							<view class="flex-col equal-division-item">
								<view class="flex-col items-center">
									<view>
										<text
											class="text_13">{{(hetong.hasOwnProperty('paid') && String(hetong.settlementContract)  !='null')?hetong.settlementContract.split('.')[0]:'0'}}</text>
										<text
											class="text_14">.{{(hetong.hasOwnProperty('paid') && String(hetong.settlementContract ) !='null')?hetong.settlementContract.split('.')[1]:'00'}}万</text>
									</view>
									<text class="text_17">当前合同总额</text>
								</view>
								<view class="flex-col items-center group_17">
									<!-- <text class="text_16">{{hetong.originalContract?hetong.originalContract:0}}万</text> -->
									<view>
										<text
											class="text_18">{{(hetong.hasOwnProperty('paid') && String(hetong.originalContract)   !='null')?hetong.originalContract.split('.')[0]:'0'}}</text>
										<text
											class="text_19">.{{(hetong.hasOwnProperty('paid') && String(hetong.originalContract)  !='null')?hetong.originalContract.split('.')[1]:'00'}}万</text>
									</view>
									<text class="text_17">原合同额</text>
								</view>
							</view>
							<view class="flex-col equal-division-item">
								<view class="flex-col items-center">
									<view>
										<text
											class="text_18">{{(hetong.hasOwnProperty('paid') && String(hetong.paid)  !='null')?hetong.paid.split('.')[0]:'0'}}</text>
										<text
											class="text_19">.{{(hetong.hasOwnProperty('paid') && String(hetong.paid)   !='null')?hetong.paid.split('.')[1]:'00'}}万</text>
									</view>
									<text class="text_17">已支付</text>
								</view>
								<view class="flex-col items-center group_20">
<!-- 									<text class="text_21">{{hetong.changeAmount?hetong.changeAmount:0}}万</text> -->
									<view>
										<text
											class="text_18">{{(hetong.hasOwnProperty('paid') && String(hetong.changeAmount) !='null')?hetong.changeAmount.split('.')[0]:'0'}}</text>
										<text
											class="text_19">.{{(hetong.hasOwnProperty('paid') && String(hetong.changeAmount) !='null')?hetong.changeAmount.split('.')[1]:'00'}}万</text>
									</view>
									<text class="text_17">变更额</text>
								</view>
							</view>
							<view class="flex-col items-center equal-division-item">
								<!-- <text class="text_23">{{hetong.unPaid?hetong.unPaid:0}}万</text> -->
								<view>
									<text
										class="text_18" style="color: #1d6aff;">{{(hetong.hasOwnProperty('paid') && String(hetong.unPaid)  !='null')?hetong.unPaid.split('.')[0]:'0'}}</text>
									<text
										class="text_19" style="color: #1d6aff;">.{{(hetong.hasOwnProperty('paid') && String(hetong.unPaid)  !='null')?hetong.unPaid.split('.')[1]:'00'}}万</text>
								</view>
								<text class="text_17">剩余支付</text>
							</view>
						</view>
					</view>
					<view v-else class="u-p-b-50">
						<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
						</u-empty>
					</view>
				</view>
				<view class="flex-col section_6" @click="go('/pages/index/progress/progress')">
					<view class="flex-row group_5" style="align-items: center;">
						<image :src="imgUrl+'16557826792503103103.png'" class="image" />
						<text class="text_25">施工进度视频</text>
					</view>
					<view class="flex-col" v-if="xunjian.hasOwnProperty('name')">
						<view class="flex-row group_21">
							<image :src="xunjian.address" class="image_14" />
							<text class="text_26">{{xunjian.name}}</text>
						</view>
						<view class="flex-col items-center group_22">
							<image
								:src="xunjian.videos +'?spm=qipa250&x-oss-process=video/snapshot,t_7000,f_jpg,w_800,h_600,m_fast'"
								class="image_15" />
							<image :src="imgUrl+'16557828337247149353.png'" class="image_16" />
						</view>
						<text class="text_27">巡检日期：{{xunjian.createDate}}</text>
					</view>
					<view v-else>
						<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
						</u-empty>
					</view>

				</view>
				<view class="flex-col list" v-if="process.planTime">
					<view class="flex-col list-item" @click="go('/pages/my/process/progress')">
						<view class="flex-col group_23 view_2">
							<view class="justify-between group_24" style="align-items: center;">
								<view class="flex-row view_4" style="align-items: center; display: flex;">
									<image :src="imgUrl+'16557826792503103103.png'" class="image_17" />
									<text class="text_28">当前动态进度</text>
								</view>
								<text class="text_29">查看详情</text>
							</view>

						</view>
						<view class="flex-col">
							<text class="text_31">总计划工期：{{process.planTime}}</text>
							<text class="text_33">施工工序：{{process.constructionPlanName}}</text>
							<text class="text_34">当前工序进度：{{process.completionSchedule}}%</text>
							<text class="text_36">预计完成时间：{{process.actualEndTimeYJ}}</text>
							<view class="flex-row group_27" style="display: flex; align-items: center;">
								<text class="text_38">已延期：{{process.delayTime?process.delayTime:0}}个工作日</text>
								<text class="text_40" @click="go('/my/process/reason')"
									v-if="process.delayTime>0">查看原因</text>
							</view>
							<text class="text_41">总计划工期延期至：{{process.actualEndTime}}</text>
						</view>

					</view>
				</view>
				<view class="flex-col list-item section_8" @click="go('/pages/index/check/check')">
					<view class="justify-between group_23">
						<view class="flex-row group_24 view_8 items-center">
							<image :src="imgUrl+'16557826792503103103.png'" class="group_25" />
							<text class="text_43">现场巡检</text>
						</view>
						<view class="flex-row text_31 view_9"
							v-if="currentXunjian.hasOwnProperty('FinishedStatusCount')">
							<text
								class="text_44">已解决：{{currentXunjian.hasOwnProperty('FinishedStatusCount')?currentXunjian.FinishedStatusCount :0}}</text>
							<text
								class="text_45">未解决：{{currentXunjian.hasOwnProperty('UnfinishedStatusCount')?currentXunjian.UnfinishedStatusCount : 0}}</text>
						</view>
					</view>
					<view class="text_34 view_10">
						<!--*-->
					</view>
					<view class="flex-col" v-if="currentXunjian.hasOwnProperty('issueTypeName')">
						<view class="justify-between group_26 view_11">
							<text class="text_36 text_46">{{currentXunjian.issueContent }}</text>
							<view class="flex-col items-center group_27 view_12"><text
									class="text_38 text_47">{{currentXunjian.rectificationStatus}}</text>
							</view>
						</view>
						<text class="text_41 text_48">问题类型:{{currentXunjian.issueTypeName}}</text>
						<text class="text_49">{{currentXunjian.issueContent}}</text>
						<view class="flex-row equal-division_1" v-if="currentXunjian.hasOwnProperty('pic')">
							<image v-for="(pic,i) in currentXunjian.pics" :src="pic" :key="i"
								class="equal-division-item_3" />

						</view>
						<text class="text_50">巡检日期：{{currentXunjian.insertTime}}</text>
					</view>
					<view v-else>
						<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
						</u-empty>
					</view>

				</view>
				<!-- 订装 -->
				<view class="flex-col section_9">
					<view class="justify-between group_28 items-center" @click="go('/pages/tool/material')">
						<view class="flex-row group_29 items-center">
							<image :src="imgUrl+'16557826792503103103.png'" class="image image_19" />
							<text class="text_51">订装安排</text>
						</view>
						<image :src="imgUrl+'16557838861113221762.png'" class="image_20" />
					</view>

					<view class="u-page">
						<view class="u-demo-block">

							<view class="u-demo-block__content ">
								<u-row justify="space-between flex-row justify-center align-center">
									<u-col span="3">
										<view class="demo-layout border-color text_66 justify-center items-center">主材名称
										</view>
									</u-col>
									<u-col span="3">
										<view class="demo-layout border-color text_66 justify-center items-center">安排节点
										</view>
									</u-col>
									<u-col span="3">
										<view class="demo-layout border-color text_66 justify-center items-center">
											据今天倒计时</view>
									</u-col>
									<u-col span="3">
										<view class="demo-layout border-color text_66 justify-center items-center" style="border-right: 1rpx solid #dedede;">查看详情
										</view>
									</u-col>
								</u-row>
							</view>
						</view>
					</view>

					<view class="u-page" v-if="arrange.length>0">
						<view class="u-demo-block" v-for="(item,index) in arrange" :key="index">

							<view class="u-demo-block__content " style="margin-top: 1px;">
								<u-row justify="space-between flex-row justify-center align-center">
									<u-col span="3">
										<view class="demo-layout text_68 border-color1 justify-center items-center" style="text-align: center;">
											{{item.materialName}}
										</view>
									</u-col>
									<u-col span="3">
										<view class="demo-layout text_68 border-color1 justify-center items-center">
											{{item.arrange}}
										</view>
									</u-col>
									<u-col span="3">
										<view class="demo-layout text_68 border-color1 justify-center items-center">
											{{item.time}}
										</view>
									</u-col>
									<u-col span="3" @click="go('/pages/index/plan/plan?orderid='+projectId)">
										<view class="demo-layout text_71 border-color1 justify-center items-center" style="border-right: 1rpx solid #dedede;">
											查看</view>
									</u-col>
								</u-row>
							</view>
						</view>
					</view>
					<view v-else>
						<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
						</u-empty>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
	import tools from '@/shop/utils/tools.js'
	export default {
		components: {},
		data() {
			return {
				totalPrice: '',
				pieshow: false,
				arrange: [],
				list_58vfMfPc: [null, null],
				list3: [
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
					'https://cdn.uviewui.com/uview/swiper/swiper2.png',
					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
				],
				pics: [],
				imgUrl: this.$IMG_URL,
				contract: false,
				estimateData: [], // 装修估算
				projectId: 0,
				xunjian: {
					url: '',
					poster: '',
				},
				process: {},
				currentXunjian: {},
				pies: [],
				hetong: {},
				param: {
					pageSize: 10,
					pageNum: 1,
				}
			};
		},
		computed:{
		  ...mapGetters(['isLogin'])	
		},
		onPullDownRefresh(){
			setTimeout(()=>{
				uni.stopPullDownRefresh()
			},1000)
		},
		created() {
			this.listense();
			this.init();
		},
		 onShow() {
		 this.getList()
		 this.init();
		},
		methods: {
			/**
			 * @description 预览图片
			 */
			ViewImage(e, list) {
			  console.log(e, list);
			  let arr = [];
			  list.forEach(e=>{
				 arr.push(e.url); 
			  })
			  uni.previewImage({
			    urls: arr,
			    current: e
			  });
			},
			listense()
			{
				uni.$on('update',()=>{
					console.log('update');
					this.init();
				})
			},
			// 统一调用接口返回数据
			async init() {
				await this.getFamily();
				await this.getXunjian();
				await this.getProcess();
				await this.getArrange();
				await this.getEstimate();
				await this.queryIssuesByUtilEnter();
				await this.sumExhibition();
				await this.getList()
			},
			queryIssuesByUtilEnter() {
				this.$http('check.queryIssuesByUtilEnter').then(r => {
					console.log(r);
					if (r.code == 200 && r.hasOwnProperty('data')) {
						this.currentXunjian = r.data;
						if (this.currentXunjian.issueMedia) {
							this.currentXunjian.pics = this.currentXunjian.issueMedia.split(',');
						}
					}
				})
			},
			sumExhibition() {
				this.$http('lbook.sumExhibition').then(r => {
					if (r.code == 200) {
						if (r.data) {
							this.hetong = r.data
						}

					}
				});
			},

			async getProcess() {
				this.$http('check.currentProcess', {
					projectId: this.projectId
				}).then(r => {
					if (r.code == 200 && r.hasOwnProperty('data')) {
						this.process = r.data;
					}
				})
			},
			// 获取图形数据
			getEstimate() {
				this.$http('estimate.queryEstPrice', ).then(r => {
					if (r.code == 200) {
						// if (r.data.estId) {
						this.estimateData = r.data;
						let arr = []
						if(String(r.data.estPrice) !='null'){
							let price = r.data.estPrice.split('~')
							price.map((item, index) => {
								arr.push((item / 1).toFixed(2) + '万')
							
							})
						}
						
						
						
						
						
						this.totalPrice = arr.join('~')
					
						this.pieshow = false;
						if (r.data.estDetailsList && r.data.estDetailsList.length > 0) {
							let data = [];
							r.data.estDetailsList.map(it => {
								data.push({
									text: it.level1Name,
									value: parseInt(it.percentage, 10),
									labelText: it.level1Name + "" + parseInt(it.percentage,
										10) + "%"
								})
							});
							this.pies = data;
							this.pieshow = true;
						} else {
							this.pieshow = false //控制显示
						}
						// }



					}
				})
			},
			async getXunjian(type = 0) {
				let res = await this.$http('queryInspectionVideos', this.param);
				if (res.code == 200 && res.hasOwnProperty('data')) {
					if (res.data.length > 0) {
						this.xunjian = res.data[0];
						// this.xunjian.poster = this.getPoster(this.xunjian.videos);
					} else {
						this.xunjian = [];
					}
				}

			},
			getPoster(url) {
				return tools.getVideoBase64(url)
			},
			getFamily() {
				this.$http('lhouse.query').then(r => {
					if (r.code == 200 && r.hasOwnProperty('data') && r.data.project) {
						this.projectId = r.data.project.projectId;
						if(this.projectId)
						{
							this.getList()
						}else{
							this.$store.dispatch('checkHouse');	 
						}
						
					} 
				});
			},

			getList() {
				this.$http('OverviewL.getSGTUrl', {
					projectId: this.projectId
				}).then(res => {
console.log('图片',res.data);
					if (res.code == 200 && res.data.overviewConstructionUrl) {
						let pic = res.data.overviewConstructionUrl.overviewConstructionUrl.split(',');
						let file = [];
						pic.map(item => {
							file.push({
								url: item
							});
						})

						if (file.length > 0) {
							this.pics = file;

						}
					}
				})
			},
			getArrange() { //订装安排
				this.$http('arrange', {
					projectId: this.projectId
				}).then(res => {
					if (res.code == 200 && res.hasOwnProperty('data')) {
						this.arrange = res.data
					}
				})
			}

		},
	};
</script>

<style scoped lang="scss">
	.wrap {
		padding: 12px;
	}

	.demo-layout {
		height: 25px;
		border-radius: 4px;
	}

	.border-color {
		border: #dedede solid;
		border-width: 1px 0 1px 1px;
		border-radius: 0px;
		height: 35px;
		background-color: #f2f6ff;
	}

	.border-color1 {
		border: #dedede solid;
		border-width: 1px 0 1px 1px;
		border-radius: 0px;
		height: 35px;
	}

	.bg-purple {
		background: #CED7E1;
	}

	.bg-purple-light {
		background: #e5e9f2;
	}

	.bg-purple-dark {
		background: #99a9bf;
	}

	.group_33 {
		height: 76rpx;
	}

	.image_22 {
		width: 54rpx;
		height: 54rpx;
	}

	.group_5 {
		padding: 32rpx 0;
		border-bottom: solid 1rpx #eeeeee;
	}

	.list-item {
		padding: 29rpx 24rpx 35rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
	}

	.image {
		// margin-top: 12rpx;
		width: 26rpx;
		height: 16rpx;
	}

	.group_23 {
		padding: 32rpx 0rpx 32rpx;
	}

	.text_34 {
		margin-top: 32rpx;
		align-self: flex-start;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.group_26 {
		margin-top: 39rpx;
	}

	.text_41 {
		margin-top: 32rpx;
		align-self: flex-start;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.image_2 {
		margin-top: 10rpx;
		flex-shrink: 0;
		width: 24rpx;
		height: 24rpx;
	}

	.group_24 {
		padding-bottom: 32rpx;
		border-bottom: solid 1rpx #eeeeee;
	}

	.text_31 {
		margin-top: 32rpx;
		align-self: flex-start;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_36 {
		margin-top: 32rpx;
		align-self: flex-start;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.group_27 {
		margin-top: 32rpx;
	}

	.group_25 {
		// margin-top: 12rpx;
		flex-shrink: 0;
		width: 26rpx;
		height: 16rpx;
	}

	.text_29 {
		margin: 6rpx 0 4rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_38 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
	}

	.text_73 {
		color: #333333;
		font-size: 20rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 23rpx;
	}

	.page {
		background-color: #f6f7f9ff;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100%;
	}

	.group {
		padding-bottom: 32rpx;
		flex: 1 1 auto;
		overflow-y: auto;
	}

	.tab-bar {
		padding: 6rpx 98rpx 16rpx 99rpx;
		background-color: #ffffff;
		box-shadow: 0px -1rpx 0px 0px #eeeeee;
	}

	.section_1 {
		padding: 0rpx 40rpx 0rpx;
		width: 100%;
		height: 160rpx;
		background-color: #e5f5fdff;
		background-image: linear-gradient(to right, #DBF1F9 10%, #e9edfc 60%, #DBF1F9);
		// border-radius: 10rpx 10rpx 10rpx 10rpx;
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;

	}

	.group_1 {
		margin-top: 160rpx;
		padding: 0 22rpx;
		position: relative;
		background-size: 100% 8%;
		background-repeat: no-repeat;
		background-image: linear-gradient(to bottom, #dbf1f9, #E2EDFB, #ffffff);
	}

	.group_32 {
		height: 75.5rpx;
	}

	.text {
		margin-top: 45rpx;
		align-self: center;
		color: #191919;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.text_1 {
		margin-top: 70rpx;
		margin-left: 56rpx;
		color: #000000;
		letter-spacing: 2rpx;
		font-size: 48rpx;
		font-family: '.AppleSystemUIFont';
		font-weight: bold;
	}

	.section_2 {
		padding: 0 24rpx 32rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
	}

	.section_3 {
		margin-top: 24rpx;
		padding: 0 24rpx 48rpx;
		background-image: linear-gradient(180deg, #e8f0ff 0%, #e8f0ff 0%, #ffffff 14.93%, #ffffff 100%);
		border-radius: 16rpx;
	}

	.section_5 {
		margin-top: 24rpx;
		background-image: linear-gradient(180deg, #e8f0ff 0%, #e8f0ff 0%, #ffffff 14.93%, #ffffff 100%);
		border-radius: 16rpx;
	}

	.section_6 {
		margin-top: 24rpx;
		padding: 0 24rpx 34rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
	}

	.list {
		padding: 24rpx 0;
	}

	.list-item {
		padding: 29rpx 24rpx 35rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
	}



	.group_26 {
		margin-top: 39rpx;
	}

	// .text_41 {
	// 	margin-top: 45rpx;
	// 	align-self: flex-start;
	// 	color: #666666;
	// 	font-size: 28rpx;
	// 	font-family: '.AppleSystemUIFont';
	// 	line-height: 33rpx;
	// }


	.text_36 {
		align-self: flex-start;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.group_27 {
		margin-top: 33rpx;
	}


	.text_29 {
		margin: 6rpx 0 4rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_38 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.section_8 {
		margin-top: 20rpx;
		padding: initial;
		margin-right: 4rpx;
		padding-left: 24rpx;
		padding-bottom: 33rpx;
	}

	.list-item:last-of-type {
		margin-top: 23rpx;
	}

	.view_10 {
		margin-top: initial;
		align-self: initial;
		color: initial;
		font-size: initial;
		font-family: initial;
		line-height: initial;
		margin-right: 40rpx;
		background-color: #eeeeee;
		border-radius: 0.5rpx;
		height: 1rpx;
	}

	.view_11 {
		margin-top: 30rpx;
		padding-left: 2rpx;
	}

	.text_48 {
		margin-top: 21rpx;
		font-size: 24rpx;
		line-height: 28rpx;
	}

	.text_49 {
		margin-top: 21rpx;
		align-self: flex-start;
		color: #666666;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.equal-division_1 {
		margin-right: 24rpx;
		margin-top: 32rpx;
	}

	.text_50 {
		margin-top: 27rpx;
		align-self: flex-start;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.view_8 {
		padding-bottom: initial;
		border-bottom: initial;
	}

	.view_9 {
		margin-top: 12rpx;
		align-self: initial;
		color: initial;
		font-size: initial;
		font-family: initial;
		line-height: initial;
		margin-right: 34rpx;
	}

	.text_46 {
		align-self: initial;
		color: #333333;
		margin-bottom: 9rpx;
	}

	.view_12 {
		margin-top: initial;
		padding-bottom: 11rpx;
		background-image: linear-gradient(90deg, #1d6aff33 0%, #1d6aff33 8.92%, #0f358000 100%, #0f358000 100%);
		border-radius: 20rpx 0px 0px 20rpx;
		width: 120rpx;
		height: 40rpx;
	}

	.equal-division-item_3 {
		flex: 1 1 204rpx;
		border-radius: 16rpx;
		width: 204rpx;
		height: 204rpx;
	}

	.equal-division-item_4 {
		margin-left: 21rpx;
		flex: 1 1 204rpx;
		border-radius: 16rpx;
		width: 204rpx;
		height: 204rpx;
	}

	.equal-division-item_5 {
		margin-left: 21rpx;
		flex: 1 1 204rpx;
		border-radius: 16rpx;
		width: 204rpx;
		height: 204rpx;
	}

	.text_43 {
		margin: initial;
		color: #191919;
		font-size: 32rpx;
		// line-height: 38rpx;
		margin-left: 16rpx;
	}

	.text_44 {
		color: #666666;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_45 {
		margin-left: 43rpx;
		color: #ff401d;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_47 {
		color: #1d6aff;
		font-size: 24rpx;
		line-height: 38rpx;
		height: 44rpx;
	}

	.section_9 {
		margin-top: 20rpx;
		margin-right: 4rpx;
		padding: 32rpx 24rpx 32rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
	}

	.text_72 {
		color: #508afa;
		font-size: 20rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 23rpx;
	}

	.group_2 {
		padding: 32rpx 0;
	}

	.image-wrapper {
		padding: 304rpx 0 12rpx;
		border-radius: 16rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826762209589466.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.button {
		margin: 32rpx 8rpx 0;
		padding: 37rpx 44rpx 37rpx;
		border-radius: 16rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826791068195761.png');
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.group_8 {

		margin-top: 70rpx;
		height: 500rpx;
		width: 100%
	}

	.group_12 {
		padding: 32rpx 24rpx 32rpx;
	}

	.group_14 {
		padding-bottom: 23rpx;
	}

	.group_21 {
		padding: 32rpx 0 24rpx;
	}

	.group_22 {
		border-radius: 16rpx;
		position: relative;
	}

	.text_27 {
		margin-top: 27rpx;
		align-self: flex-start;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.list-item:last-of-type {
		margin-top: 23rpx;
	}

	.group_28 {
		padding-bottom: 32rpx;
	}

	.group_30 {
		margin-top: 41rpx;
		height: 80rpx;
		position: relative;
	}

	.group_4 {
		// margin-top: 6rpx;
	}

	.image_4 {
		width: 40rpx;
		height: 12rpx;
	}

	.group_7 {
		// margin-top: 6rpx;
	}

	.text_6 {
		margin-top: 3rpx;
		color: #191919;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_7 {
		margin-left: 26rpx;
		color: #1d6aff;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 38rpx;
	}

	.text_8 {
		align-self: flex-start;
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.group_9 {
		margin-top: -10.5rpx;
		position: relative;
	}

	.text_12 {
		margin: 6rpx 9rpx 4rpx 0;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.divider {
		margin: 0 24rpx;
		background-color: #eeeeee;
		border-radius: 0.5rpx;
		height: 1rpx;
	}

	.equal-division {
		margin-top: 33rpx;
		padding: 0 12rpx;
	}

	.text_25 {
		margin-left: 16rpx;
		color: #191919;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		// line-height: 38rpx;
	}

	.image_14 {
		border-radius: 32rpx;
		width: 64rpx;
		height: 64rpx;
	}

	.text_26 {
		margin-left: 24rpx;
		margin-top: 10rpx;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.image_15 {
		border-radius: 16rpx;
		width: 654rpx;
		height: 328rpx;
	}

	.image_16 {
		border-radius: 50%;
		width: 80rpx;
		height: 80rpx;
		position: absolute;
		left: 279rpx;
		top: 50%;
		transform: translateY(-50%);
	}

	.view_2 {
		padding: initial;
	}

	.group_29 {
		// margin-bottom: 10rpx;
	}

	.image_20 {
		// margin-right: 14rpx;
		// margin-top: 22rpx;
		width: 14rpx;
		height: 26rpx;
	}

	.section_10 {
		padding: 19rpx 16rpx 27rpx;
		border-radius: 4rpx 4rpx 0 0;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826785022490611.png');
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
	}

	.section_11 {
		background-color: #d9d9d9;
		width: 1rpx;
		height: 294rpx;
		position: absolute;
		left: 0;
		top: 8rpx;
	}

	.section_12 {
		background-color: #d9d9d9;
		width: 1rpx;
		height: 294rpx;
		position: absolute;
		right: 0;
		top: 8rpx;
	}

	.section_13 {
		padding: 17rpx 57rpx 35rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826789680120150.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		position: absolute;
		left: 0;
		right: 0;
		top: 71rpx;
	}

	.section_14 {
		padding: 17rpx 57rpx 35rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826789680120150.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		position: absolute;
		left: 0;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	.section_15 {
		padding: 17rpx 57rpx 35rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826789680120150.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		position: absolute;
		left: 0;
		right: 0;
		top: 229rpx;
	}

	.section_16 {
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557826789680120150.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		position: absolute;
		left: 0;
		right: 0;
		top: 308rpx;
	}

	.section_17 {
		background-color: #d9d9d9;
		width: 1rpx;
		height: 69rpx;
		position: absolute;
		left: 163rpx;
		top: 0;
	}

	.section_18 {
		background-color: #d9d9d9;
		width: 1rpx;
		height: 388rpx;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}

	.section_19 {
		background-color: #d9d9d9;
		width: 1rpx;
		height: 388rpx;
		position: absolute;
		right: 163rpx;
		top: 0;
	}

	.image_1 {
		flex-shrink: 0;
	}

	.text_2 {
		margin-left: 16rpx;
		color: #191919;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		// line-height: 38rpx;
	}

	.text_3 {
		margin-left: 7rpx;
		margin-bottom: 4rpx;
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 40rpx;
		height: 40rpx;
	}

	.image_5 {
		flex-shrink: 0;
	}

	.text_4 {
		margin-left: 16rpx;
		color: #191919;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		// line-height: 38rpx;
	}

	.text_5 {
		margin-left: 7rpx;
		// margin-bottom: 4rpx;
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 40rpx;
		height: 40rpx;
	}

	.group_10 {
		margin-right: 16rpx;
		width: 426rpx;
		height: 211.5rpx;
		position: relative;
	}

	.text_10 {
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
		position: absolute;
		right: 0;
		bottom: 41rpx;
	}

	.image_12 {
		flex-shrink: 0;
	}

	.text_11 {
		margin-left: 16rpx;
		color: #191919;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		// line-height: 38rpx;
	}

	.equal-division-item {

		flex: 1 1 225rpx;
	}

	.text_33 {
		margin-top: 33rpx;
		align-self: flex-start;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.image_19 {
		flex-shrink: 0;
	}

	.text_51 {
		margin-left: 16rpx;
		color: #191919;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		// line-height: 38rpx;
	}

	.text-wrapper {
		flex: 1 1 132rpx;
	}

	.text-wrapper_1 {
		margin-left: 31rpx;
		flex: 1 1 132rpx;
	}

	.text-wrapper_2 {
		margin-left: 31rpx;
		flex: 1 1 132rpx;
	}

	.text-wrapper_3 {
		margin-left: 32rpx;
		flex: 1 1 132rpx;
	}

	.text_56 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_57 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_58 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_59 {
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_60 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_61 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_62 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_63 {
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_64 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_65 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_66 {
		color: #737674;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_67 {
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.group_31 {
		padding: 17rpx 57rpx 34rpx;
	}

	.image_21 {
		width: 654rpx;
		height: 1rpx;
	}

	.group_11 {
		width: 282rpx;
		height: 211.5rpx;
		position: relative;
	}

	.text_9 {
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
		position: absolute;
		right: 0;
		top: 7.5rpx;
	}

	.group_17 {
		margin-top: 44rpx;
	}

	.group_20 {
		margin-top: 44rpx;
	}

	.text_23 {
		color: #1d6aff;
		font-size: 40rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 47rpx;
	}

	.text_24 {
		margin-top: 6rpx;
		color: #666666;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.view_4 {
		margin-top: initial;
		flex-shrink: initial;
		width: initial;
		height: initial;
	}

	.text_40 {
		margin-left: 26rpx;
		// margin-top: 3rpx;
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		// line-height: 28rpx;
	}
	
	
	.line2 {
	  overflow: hidden;
	  text-overflow: ellipsis;
	  display: -webkit-box;
	  -webkit-line-clamp: 2;
	  -webkit-box-orient: vertical;
	}
	
	.text_52 {
		color: #666666;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_53 {
		color: #666666;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_54 {
		color: #666666;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_55 {
		color: #666666;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_68 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_69 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_70 {
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_71 {
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.image_7 {
		width: 64rpx;
		height: 38rpx;
		position: absolute;
		left: 0;
		top: 0;
	}

	.image_8 {
		width: 64rpx;
		height: 38rpx;
		position: absolute;
		right: 0;
		bottom: 16.5rpx;
	}

	.section_4 {
		background-image: repeating-linear-gradient(90deg, #1c62f9, #1c62f9 0%, transparent 0%, transparent 0%);
		width: 33rpx;
		height: 1rpx;
		position: absolute;
		right: 36rpx;
		top: 20.5rpx;
	}

	.image_9 {
		width: 191rpx;
		height: 100rpx;
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
	}

	.image_10 {
		width: 114rpx;
		height: 131rpx;
		position: absolute;
		right: 45.5rpx;
		top: 11.5rpx;
	}

	.image_11 {
		width: 101rpx;
		height: 131rpx;
		position: absolute;
		left: 35.5rpx;
		top: 11.5rpx;
	}

	.text_15 {
		margin-top: 12rpx;
		color: #666666;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_16 {
		color: #666666;
		font-size: 40rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 47rpx;
	}

	.text_17 {
		margin-top: 26rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_20 {
		margin-top: 12rpx;
		color: #666666;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_21 {
		color: #666666;
		font-size: 40rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 47rpx;
	}

	.text_22 {
		margin-top: 26rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.image_17 {
		// margin-top: 18rpx;
		flex-shrink: 0;
		width: 26rpx;
		height: 16rpx;
	}

	.text_28 {
		margin-left: 16rpx;
		color: #191919;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';
		// line-height: 38rpx;
	}

	.text_13 {
		color: #333333;
		font-size: 40rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 47rpx;
	}

	.text_14 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_18 {
		color: #333333;
		font-size: 40rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 47rpx;
	}

	.text_19 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}
</style>
